<template>
  <div id="personaldata">
    <div id="password" style="margin: 100px 0">
      <div class="doit">
        <p class="title">修改个人资料</p>
        <div class="one">
          <span>真实姓名</span>
          <el-input
            type="text"
            size="mini"
            placeholder="请输入真实姓名"
            v-model="truename"
          >
          </el-input>
        </div>
        <div class="one">
          <span>手机号码</span>
          <el-input
            type="text"
            size="mini"
            placeholder="请输入手机号码"
            v-model="phonenum"
          >
          </el-input>
        </div>
        <div class="one">
          <span>邮箱地址</span>
          <el-input
            type="text"
            size="mini"
            placeholder="请输入邮箱地址"
            v-model="email"
          >
          </el-input>
        </div>
        <div class="buttons">
          <el-button @click="postmsg">确定</el-button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import msgbox from '@/common/msgbox.js'

export default {
  name: 'personaldata',
  data () {
    return {
      truename: '',
      phonenum: '',
      email: ''
    }
  },
  mounted () {
    this.getmsg()
  },
  methods: {
    getmsg () {
      let that = this
      this.$g.ajax({
        method: 'get',
        path: 'admins/self',
        cbSuccess: function (data) {
          console.log(data)
          that.truename = data.memo.truename
          that.phonenum = data.memo.mobile
          that.email = data.memo.email
        },
        cbError: function (data) {
          let msg = msgbox.get(data.msg)
          that.$message.error(msg)
        }
      })
    },
    postmsg () {
      let pdata = [
        {
          val: this.truename,
          rules: {//  规则
            required: {
              msg: msgbox.get('真实姓名不能为空')
            }
          }
        },
        {
          val: this.phonenum,
          rules: {//  规则
            required: {
              msg: msgbox.get('手机号不能为空')
            },
            mobile: {
              msg: msgbox.get('请输入正确的手机号')
            }
          }
        },
        {
          val: this.email,
          rules: {//  规则
            required: {
              msg: msgbox.get('邮箱不能为空')
            },
            email: {
              msg: msgbox.get('请输入正确的邮箱')
            }
          }
        }
      ]
      let ress = this.$g.verify.check(pdata)
      if (ress !== true) {
        this.$message.error(ress)
        return false
      }
      let p = /^\S+$/
      if (p.test(this.truename)) {
        let that = this
        this.$g.ajax({
          method: 'post',
          path: 'admins/update',
          data: {
            email: this.email,
            mobile: this.phonenum,
            truename: this.truename
          },
          cbSuccess: function (data) {
            that.$message.success('修改成功')
          },
          cbError: function (data) {
            let msg = msgbox.get(data.msg)
            that.$message.error(msg)
          }
        })
      } else {
        this.$message.error('真实姓名不能输入空格')
      }
    }
  }
}
</script>

<style lang="scss" scoped>
  .title {
    text-align: center;
    font-size: 18px;
    font-weight: bold;
  }
  .doit .one .el-input {
    width: 200px;
    margin-left: 20px;
  }
  .doit .one {
    margin-top: 20px;
    font-size: 14px;
  }
  .doit {
    padding: 10px;
    font-size: 16px;
    margin: 0 auto;
    width: 290px;
    p {
      line-height: 30px;
      color: #666;
      span {
        color: #333;
        margin-left: 15px;
      }
    }
  }
  .el-select  {
    position: relative;
    left: 16px;
    width: 200px;
  }
  .buttons {
    margin-top: 20px;
    text-align: center;
    button {
      margin: 0 20px;
    }
  }
</style>
